<template>
	<view class="cart" >
		<!-- <view class="c"> -->
			<!-- 右上角删除按钮 -->
			<view class="avatar" :style="{background:`url(${vuex_titleBg})`}">
				<view style="height: 134rpx;padding-top: 62rpx;padding-left: 10px;margin-bottom: 10px;">
					<image style="width: 260rpx;height: 90rpx;" src="/static/image/logo.png" mode="aspectFit" />
				</view>
				<!-- background-color: #efefef; -->
				<div class="" style="padding:0 20px 10px;">
					<div class="shopping" style=" display: flex;justify-content: space-between;">
						<uni-section title="购物车" titleFontSize="4vw" type="line">
							<text style="font-weight: bold;color: #fff;">注意：不同分组订单不能同时结算</text>
						</uni-section>
						<view class="delete" @click="deleteSp()" style="padding:5px 15px;border-radius: 20px;color: #ffffff;background-color: #ed3f14;margin: auto 0;">
							删除
						</view>
					</div>
				
					<!-- <view class="line"></view> -->
				</div>
			</view>
			
			<view class="shopAll" style="overflow: auto;flex: 1;padding: 0 20rpx 20rpx;">
				<!-- 购物车列表 -->
				<view v-for="(value,key) in list" :key='key'>
					<view style="margin-top: 10px;">分组：{{key}}
					<text :style="{color:key == '0'?'red':'green'}">（{{key=='0'?'暂不可结算':'可结算'}}）</text>
					</view>
				<view  v-for="item in value" :key='item.id'>
					<view v-if="item.busType == '0'" class="list">
						<view class="l" style="margin-right: 20rpx;">
							
							<evan-checkbox class="checkbox" v-model="item.isChecked"></evan-checkbox>
							<!-- @click="jump(item)"  -->
							<image :src="item.shopInv.basInv.picUrl?vuex_config.baseUrl + item.shopInv.basInv.picUrl:''" mode="aspectFit" class="img"></image>
						</view>
						<view class="center" @click="jump(item)">
							<view class="name" style="text-align: left;">
								{{item.shopInv.basInv.cinvname}} 
							</view>
							<!-- <view class="size" style="margin-top: 4%;text-align: left;margin-bottom: 15px;">
								规格：{{item.shopInv.basInv.cinvstd?item.shopInv.basInv.cinvstd:''}}
							</view> -->
							<view class="price" style="margin-top: 5px;margin-bottom: 6px;">
								<div v-if="item.shopInv.basInv.appPrice" style="font-weight: 600;margin-bottom: 6px;">&yen</div>
								<div style="font-weight: 600;font-size: 42rpx;width: 100%;">{{item.shopInv.basInv.appPrice?item.shopInv.basInv.appPrice:'暂无单价'}}</div>
							</view>
						</view>
						<view class="r">
							
							
							<view class="update-count" style="margin-top: 60px;">
								<u-number-box v-model="item.iqty" :min="1" @change="valChange($event,item.id)"></u-number-box>
								
								<!-- <view class="reduce" @tap="reduce(item.id)">
									-
								</view>
								<view class="cart-count" @tap="shopNum(item)">
									{{item.iqty}}
								</view>
								<view class="add" @tap="add(item.id)">
									+
								</view> -->
						
						
							</view>
						</view>
					</view>
					
					<view v-if="item.busType == '1'" class="list">
						<view class="l" style="margin-right: 20rpx;">
							<evan-checkbox v-model="item.isChecked"></evan-checkbox>
							<!-- @click="jump(item)" -->
							<image  :src="item.shopProductSell.picUrl?vuex_config.baseUrl + item.shopProductSell.picUrl:''" mode="aspectFit" class="img"></image>
						</view>
						<view class="center" @click="jump(item)">
							<view class="name" style="text-align: left;height: 30px;">
								{{item.shopProductSell.abbName}}
							</view>
							<view class="size" style="margin-top: 4%;text-align: left;margin-bottom: 15px;">
								简介：{{item.shopProductSell.ctitle?item.shopProductSell.ctitle:''}}
							</view>
							<view class="price" style="margin-bottom:6px;">
								<div style="font-weight: 600;margin-bottom: 6px;">&yen</div>
								<div style="font-weight: 600;font-size: 20px;">{{item.shopProductSell.fprice}}</div>
								
							</view>
						</view>
						<view class="r">
							<view class="update-count" style="margin-top: 60px;">
								<u-number-box v-model="item.iqty" :min="1" @change="valChange($event,item.id)"></u-number-box>
								<!-- <view class="reduce" @tap="reduce(item.id)">
									-
								</view>
								<view class="cart-count" @tap="shopNum(item)">
									{{item.iqty}}
								</view>
								<view class="add" @tap="add(item.id)">
									+
								</view> -->
						
						
							</view>
						</view>
					</view>

					<view v-if="item.busType == '3'" class="list">
						<view class="l" style="margin-right: 20rpx;">
							<evan-checkbox v-model="item.isChecked"></evan-checkbox>
							<image  :src="item.shopSalesPackage.picUrl?vuex_config.baseUrl + item.shopSalesPackage.picUrl:''" mode="aspectFit" class="img"></image>
						</view>
						<view class="center" @click="jump(item)">
							<view class="name" style="text-align: left;">
								{{item.shopSalesPackage.title}} 
								<!-- 此处添加一个编辑按钮图标-->
								<!-- <text class="cuIcon-edit margin-left" style="font-size: 36rpx;"></text> -->
								 <u-icon name="edit-pen" :custom-style="iconStyle"></u-icon>

							</view>
							<view class="size" style="margin-top: 4%;text-align: left;margin-bottom: 15px;">
								{{ item.shopSalesPackage.batchType == 1 ? '首批' : '非首批' }}
							</view>
							<view class="price" style="margin-bottom:6px;">
								<div style="font-weight: 600;margin-bottom: 6px;">&yen</div>
								<div style="font-weight: 600;font-size: 20px;">{{item.shopSalesPackage.fmaount}}</div>
								
							</view>
						</view>
						<view class="r">
							<view class="update-count" style="margin-top: 60px;">
								<u-number-box v-model="item.iqty"  :min="1" :disabled="item.shopSalesPackage.batchType == '1'"  @change="valChange($event,item.id)"></u-number-box>						
							</view>
						</view>
					</view>
					
				</view>
				
				
					
				</view>
				
				
				<view v-if="listArr.length>0" style="margin-top: 4%;height: auto;text-align: center;">~~到底啦~~</view>
				
				<!-- 页面为空 -->
				<view class="page-box" v-if="listArr.length<=0">
					<view class="centre">
						<!-- https://cdn.uviewui.com/uview/template/taobao-order.png -->
						<image style="margin: auto;" src="/static/image/taobao-order.png" mode="">
						</image>
						<view class="explain">
							购物车为空
							<view class="tips">去逛一逛~</view>
						</view>
						<!-- <view class="btn">随便逛逛</view> -->
					</view>
				</view>
			</view>
		
		<!-- </view> -->
		<!-- 底部结算栏目 -->
		<view style="width: 100%;height: 120rpx;">
			
		<view class="tabbar">
			<view class="all">
				<evan-checkbox v-model="isAllChecked"></evan-checkbox>
				<text style="line-height: 30px;">全选</text>
			</view>
			<!-- <view class="totalNUm">
				已选{{cartTotalNum}}件
			</view> -->

			<view class="totalPrice" style="display: flex;color: black;margin-left: 15%;">
				<text>合计:</text>
				<view class="totalPrice1">&yen{{cartTotalPrice}}
				</view>
			</view>

			<view class="submitOrder" @tap="submitOrder">
				结算({{cartTotalNum}})
			</view>
		</view>

		
		</view>

		
		<u-mask :show="isShowLoading">
		    <view style="display: flex;justify-content: center;align-items: center;height: 100%;">
				<view class="">
					<u-loading mode="flower" size="60" />
					<view class=""></view>
					<text style="color:white;">加载中...</text>
				</view>
		    </view>
		</u-mask>
	</view>
</template>


<script>
	import {
			mapState
		} from 'vuex';
		
	export default {
		data() {
			return {
				idFlag:'',
				isShowLoading:false,
				updateCountTimeout: null, // 用于防抖的定时器
				// 防重复提交相关
				isSubmitting: false,
				lastRequestId: null,
				// show: false,
				// content: '确认删除吗？',
				list: [],
				listArr:[],
				tar: {
					color: '#07A7E3',
					id: 2,
				}, //向子组件发送的值
				falg: false,
				indicatorDots: true,
				autoplay: true,
				interval: 2000, //切换的间隔时间
				duration: 500, //滑动动画时长
				iconStyle:{
					color: '#ed3f14',
					fontSize: '40rpx',
					marginLeft: '10rpx'

				},

				info: [{
						colorClass: 'uni-bg-red',
						url: '/static/image/1.png',

					},
					{
						colorClass: 'uni-bg-green',
						url: '/static/image/2.png',

					},
					{
						colorClass: 'uni-bg-blue',
						url: '/static/image/3.png',

					},
					{
						colorClass: 'uni-bg-blue',
						url: '/static/image/4.png',

					}, {
						colorClass: 'uni-bg-blue',
						url: '/static/image/3.png',

					}
				],

				info2: [{
					colorClass: 'uni-bg-red',
					url: '/static/image/6.png',

				}, ],


				box: false,
				model: {
					cWhCode: '',
					cWhName: '',
				},
				carVenSelectList: [],
				cWhType: '',
			}
		},
		computed: {
			...mapState(['vuex_cartList']),
			// 全选
			isAllChecked: {
				// list列表--->全选
				get() {
					// 列表中是否都选中了
					return this.listArr.every(el => el.isChecked == true)
				},
				// 全选---->list列表
				set(val) {
					this.listArr.forEach(el => el.isChecked = val)
				}
			},
			// 购物车商品总价
			cartTotalPrice() {
				// 计算list列表中所有选中商品的价格
				var sum = 0
				this.listArr.forEach(el => {
					if (el.isChecked) {
						sum = el.sumPrice  + sum
					}
				})

				return sum
			},

			// 购物车件数
			cartTotalNum() {
				// 计算list列表中所有选中商品的价格
				var num = 0
				this.listArr.forEach(el => {
					if (el.isChecked) {
						num = num + el.iqty;
					}
				})

				return num
			},
		},
		onShow: function () {
			this.list= []
			this.listArr= []
			this.listData('1')
			// 设置底部导航栏角标
			uni.setTabBarBadge({
				index: 2,
				text: this.vuex_cartList + ''
			});
			if (!this.vuex_cartList) {
				uni.removeTabBarBadge({
					index: 2
				});
			}
		},
		onLoad() {
			
		},
		onUnload() {
			// 页面卸载时清除定时器
			if (this.updateCountTimeout) {
				clearTimeout(this.updateCountTimeout);
				this.updateCountTimeout = null;
			}
		},
		methods: {
			// 展开详情
			open(item){
				item.show = !item.show
			},
			jump(item){
				console.log(item)
				if(item.busType == '0'){
					uni.navigateTo({
						url: '/pages/btdm/index/order/orderDetails?item=' + JSON.stringify(item.shopInv.basInv),
					})
				}else if(item.busType == '1'){
					uni.navigateTo({
						url: '/pages/btdm/index/order/sellDetails?id=' + item.shopProductSell.id,
					})
				}else if(item.busType == '3'){
					// uni.navigateTo({
					// 	url: '/pages/btdm/index/order/sellDetails?id=' + item.shopProductSell.id,
					// })
					uni.navigateTo({
						url: '/pages/btdm/index/order/sellPackages?id=' + item.shopSalesPackage.id + '&cartId=' + item.id,
					})
				}
			},
			listData(first){
				this.$u.api.shop.cartListData({
					cusCode:this.vuex_basCus.code,
					createBy:this.vuex_user.userCode,
				})
				.then(res => {
						//  this.list = res.list.map(item=>{
						// 	item.isChecked = false
						// 	if(item.busType == '0'){
						// 		item.sumPrice = item.iqty * (item.shopInv.basInv.appPrice?item.shopInv.basInv.appPrice:999)
						// 	}else if(item.busType == '1'){
						// 		item.sumPrice = item.iqty * (item.shopProductSell.fprice?item.shopProductSell.fprice:999)
						// 	}
						// 	return item
						// })
						// this.$store.commit("modifyCartList",this.list.length)
						let obj = res
						let arr = []
						for (let key in obj) {
							obj[key].forEach(item=>{
									item.isChecked = false
									if(item.busType == '0'){
										item.sumPrice = item.iqty * (item.shopInv.basInv && item.shopInv.basInv.appPrice?item.shopInv.basInv.appPrice:'暂无单价')
									}else if(item.busType == '1'){
										item.sumPrice = item.iqty * (item.shopProductSell.fprice?item.shopProductSell.fprice:'暂无单价')
									}else if(item.busType == '3'){
										item.sumPrice = item.iqty * (item.fprice?item.fprice:'暂无单价')
									}
									arr.push(item)
							})
						}
						// first == '1'第一次进入和删除时
						if(first == '1'){
							this.list = obj
							this.listArr = arr
						}
						// else{
							// let items={};
							// arr.forEach(item=>{
							// 	if(this.idFlag && item.id == this.idFlag){
							// 		items = {...item}
							// 	}
							// })
							// this.list= this.list.map(item=>{
							// 	console.log(11111);
							// 	item = item.map(i=>{
							// 		if(this.idFlag && i.id == this.idFlag){
							// 			item = {...items,isChecked:item.isChecked}
							// 		}
							// 		return i;
							// 	})
							// 	return item;
							// })
							
							// this.listArr=this.listArr.map(item=>{
							// 	console.log(2222);
							// 	if(this.idFlag && item.id == this.idFlag){
							// 		item = {...items,isChecked:item.isChecked}
							// 	}
							// 	return item
							// })
						// }
						
						this.$store.commit("modifyCartList",this.listArr.length)
						console.log(this.list,'this.list===');
						console.log(this.listArr,'this.listArr===');
						// this.isShowLoading=false;
				});
			},
			shopNum(item){
				console.log(id,'123');
			},
			valChange(value,id){
				this.idFlag = id
				// console.log(value,id,'6666666');
				let that = this
				that.listArr.forEach(el => {
					if (el.id == id) {
						el.iqty = value.value;
						if(el.busType == '0'){
							el.sumPrice = el.iqty * (el.shopInv.basInv.appPrice?el.shopInv.basInv.appPrice:'暂无单价')
						}else if(el.busType == '1'){
							el.sumPrice = el.iqty * (el.shopProductSell.fprice?el.shopProductSell.fprice:'暂无单价')
						}else if(el.busType == '3'){
							el.sumPrice = el.iqty * (el.fprice?el.fprice:'暂无单价')
						}
					}
				
				})
				
				// 防抖处理：清除之前的定时器
				if (that.updateCountTimeout) {
					clearTimeout(that.updateCountTimeout);
				}
				
				// 设置新的定时器
				that.updateCountTimeout = setTimeout(() => {
					// that.isShowLoading=true;
					that.listArr.forEach(el => {
						if (el.id == id) {
							// el.iqty++
							that.$u.api.shop.updateCount({
								id:el.id,
								iqty:el.iqty
							})
							.then(res => {
								that.listData()
							});
							
						}
					
					})
				}, 500)
			},
			add(id) {
				let that = this
				this.idFlag = id
				that.listArr.forEach(el => {
					if (el.id == id) {
						el.iqty++
						if(el.busType == '0'){
							el.sumPrice = el.iqty * (el.shopInv.basInv.appPrice?el.shopInv.basInv.appPrice:'暂无单价')
						}else if(el.busType == '1'){
							el.sumPrice = el.iqty * (el.shopProductSell.fprice?el.shopProductSell.fprice:'暂无单价')
						}
					}
				
				})
				
				// 防抖处理：清除之前的定时器
				if (that.updateCountTimeout) {
					clearTimeout(that.updateCountTimeout);
				}
				
				// 设置新的定时器
				that.updateCountTimeout = setTimeout(() => {
					// that.isShowLoading=true;
					that.listArr.forEach(el => {
						if (el.id == id) {
							// el.iqty++
							that.$u.api.shop.updateCount({
								id:el.id,
								iqty:el.iqty
							})
							.then(res => {
								that.listData()
							});
							
						}
					
					})
				}, 500)

			},
			// 减少商品数量
			reduce(id) {
				this.idFlag = id
				let that = this
				that.listArr.forEach(el => {
					if (el.id == id) {
						if (el.iqty > 1) {
							el.iqty--
							if(el.busType == '0'){
								el.sumPrice = el.iqty * (el.shopInv.basInv.appPrice?el.shopInv.basInv.appPrice:'暂无单价')
							}else if(el.busType == '1'){
								el.sumPrice = el.iqty * (el.shopProductSell.fprice?el.shopProductSell.fprice:'暂无单价')
							}
						} else {
							uni.showToast({
								title: '至少购买一件商品哦',
								icon: 'none'
							})
						}
						
					}
				
				})
				
				// 防抖处理：清除之前的定时器
				if (that.updateCountTimeout) {
					clearTimeout(that.updateCountTimeout);
				}
				
				// 设置新的定时器
				that.updateCountTimeout = setTimeout(() => {
					// that.isShowLoading=true;
					
					that.listArr.forEach(el => {
						if (el.id == id) {
							that.$u.api.shop.updateCount({
								id:el.id,
								iqty:el.iqty
							})
							.then(res => {
								that.listData()
							});
							
						}
					
					})
				}, 500)

			},
			areIdsTheSame(array) {  
			  // 获取第一个对象的route作为比较的基准  
			  // const route = array[0].route.route;  
			  const groupKey = array[0].groupKey;  
			  
			  
			  // 使用every方法对每个数组的每个元素检查route是否相同  
			  // return array.every((obj) => obj.route.route === route);  
			  return array.every((obj) => obj.groupKey === groupKey);  
			},
			// 提交购物车订单
			submitOrder() {
				// 防重复提交：检查是否正在提交中
				if (this.isSubmitting) {
					this.$u.toast('订单处理中，请勿重复操作');
					return;
				}

				// 判断是否选择购物车商品
				var bol = this.listArr.every(el => el.isChecked == false)

				// 列表中未选中提示……
				if (bol) {
					uni.showToast({
						title: '请选择商品',
						icon: 'none'
					})
					return;
				}

				let submitFlag = true; //是否有不可结算订单
				// 提交选中的订单列表
				var cartList = [];
				this.listArr.forEach(el => {
					if (el.isChecked) {
						cartList.push(el)
					}
				})
				let arr = cartList.map(item=>{
					if(item.route &&item.route.route == '0'){
						submitFlag = false
					}
					return item.id
				})
				
				if(!submitFlag){
					this.$u.toast('请先取消不可结算订单');
					return false;
				}
				if(!this.areIdsTheSame(cartList)){
					this.$u.toast('不能同时结算不同分组订单');
					return false;
				}

				// 生成唯一的请求ID（时间戳 + 随机数）
				const requestId = `${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
				
				// 检查是否与上次请求ID相同（双重保险）
				if (this.lastRequestId === requestId) {
					console.warn('请求ID重复，阻止提交');
					return;
				}

				// 设置提交状态
				this.isSubmitting = true;
				this.lastRequestId = requestId;

				// 显示加载提示
				uni.showLoading({
					title: '订单处理中...',
					mask: true
				});

				this.$u.api.shop.shopCarBalanceForm({
					requestId: requestId, // 添加唯一请求ID
					cusCode:this.vuex_basCus.code,
					selIds: arr.join(',')
				})
				.then(res => {
					// 隐藏加载提示
					uni.hideLoading();
					
					if(res.result == 'true'){
						uni.navigateTo({
							// url: '/pages/btdm/index/order/submit?list=' + JSON.stringify(res.data),
							url: '/pages/btdm/index/order/submit',
							success: function(resp) {
							   // 通过eventChannel向被打开页面传送数据
							   // 其中含有两个参数，第一个是接收的函数名，第二个则是需要携带的参数
							   resp.eventChannel.emit('acceptData', res.data)
							 }
						})
					}else{
						uni.showToast({
							title: res.message,
							icon: 'none',
						});
					}
				})
				.catch(error => {
					// 隐藏加载提示
					uni.hideLoading();
					console.error('订单处理失败:', error);
					uni.showToast({
						title: '订单处理失败，请重试',
						icon: 'none'
					});
				})
				.finally(() => {
					// 恢复提交状态（延迟恢复，防止快速重复点击）
					setTimeout(() => {
						this.isSubmitting = false;
					}, 1000);
				});
			},

			// 删除弹框
			deleteSp() {
				this.idFlag = ''
				// var bol = this.list.every(el => el.isChecked == false)
				var that = this;
				that.deleteId = [];
				that.listArr.map(function(item, index) {
					if (item.isChecked) {
						that.deleteId.push(item.id)
					}
				})

				// 为空
				if (that.deleteId.length == 0) {
					uni.showToast({
						title: '请选择要删除的商品',
						icon: 'none',
					});
				} else {
					uni.showModal({
						title: '提示',
						content: '是否删除所选商品?',
						showCancel: true,
						cancelText: "我再想想",
						success: function(res) {
							// 确认删除
							if (res.confirm) {
								console.log(that.deleteId);
								that.$u.api.shop.cleanAllCart({selIds:that.deleteId.join(',')})
								.then(res => {
									console.log(res,'=========');
									that.listData('1')
								});

								return
							} else if (res.cancel) {
								console.log('用户点击取消');
							}


						}
					});
				}
			},

		},
		
	}
</script>

<style lang="scss" scoped>
	// /deep/ .evan-checkbox,.evan-checkbox__inner{
	// 	width: 30px !important;
	// 	height: 30px !important;
	// }
	/deep/ .u-icon-plus{
	    width: 100rpx !important;
	}
	/deep/ .u-icon-minus {
	    width: 100rpx !important;
	}
	/deep/.uni-section .uni-section-header__decoration {
	    margin-right: 6px;
	    background-color: #ffaa00;
	}
	/deep/.uni-section .uni-section-header__content .distraction {
	    color: #fff !important;
	}
	
	
	/deep/.uni-section {
	    background-color: transparent;
	}
	/deep/.evan-checkbox__inner{
		width: 30px !important;
		height: 30px !important;
	}
	.avatar {
		// background: url('/static/image/homeAvatar.jpg');
	}
	
	
	page {
		width: 100%;
		height: 100%;
		text-align: center;
		// background: #f1e8e7;
	}

	.cart {
		// background: #f1e8e7;
		height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	// .c {
	// 	width: 670rpx;
	// 	margin: 0 auto;

		

	// }
	.line {
		width: 100%;
		height: 1px;
		background-color: #e5e5e5;
		margin-top: 1%;
	}

	// 居中显示
	@mixin textCenter {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.list {
		width: 100%;
		// height: 208rpx;
		background: #f9f9f9;
		box-shadow: 0 8rpx 16rpx 0 rgba(83, 66, 49, 0.08);
		border-radius: 24rpx;
		// border-radius: 24rpx;
		margin-top: 10px;
		padding: 10px;
		display: flex;
		justify-content: space-around;
		// align-items: center;

		.l {
			display: flex;
			align-items: center;

			.img {
				width: 180rpx;
				height: 160rpx;
				background-color: white;
				margin-left: 10rpx;
				border-radius: 8%;
			}
		}

		.center {
			width: 130rpx;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			.name {
				font-size: 15px;
				font-weight: 600;
				color: #3E3E3E;
				letter-spacing: 1.86rpx;
				white-space: nowrap;
				// text-overflow: ellipsis;
				// overflow: hidden;
				width: 430rpx;
				min-height: 50px;
				// margin-right: 118rpx;
				white-space: normal
			}

			.size {
				font-size: 22rpx;
				color: #8D8D8D;
				letter-spacing: 1.57rpx;
			}

			.count {
				font-size: 22rpx;
				color: #8D8D8D;
				letter-spacing: 1.57rpx;
			}

		}

		.price {
			display: flex;
			// margin-bottom: 10rpx;
			width: 170rpx;
			font-size: 26rpx;
			color: red;
			letter-spacing: 0;
			margin-right: 118rpx;
			font-family: Arial;
		}

		.r {
			display: flex;
			flex-direction: column-reverse;
			margin-bottom: 5px;
			width: 100%;

			// 加减数量
			.update-count {
				margin-top: 0rpx;
				display: flex;
				// align-items: center;

				.reduce {
					width: 40rpx;
					height: 40rpx;
					background: #F1ECE7;
					border-radius: 21.6rpx;
					border-radius: 21.6rpx;
					color: #979797;
					@include textCenter;
					font-size: 50rpx;
				}

				.add {
					width: 40rpx;
					height: 40rpx;
					background: #F1ECE7;
					border-radius: 21.6rpx;
					border-radius: 21.6rpx;
					color: #979797;
					@include textCenter;
					font-size: 40rpx;
				}

				.cart-count {
					width: 80rpx;
					height: 40rpx;
					background: #F1ECE7;
					border-radius: 21.6rpx;
					border-radius: 21.6rpx;
					margin-left: 18rpx;
					margin-right: 18rpx;
					text-align: center;
					line-height: 40rpx;
				}
			}
		}
	}

	// 底部导航
	.tabbar {
		width: 100%;
		height: 120rpx;
		background-color: #ffffff;
		position: fixed;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: space-around;
		// border-radius: 8% 8%;

		.all {
			font-size: 32rpx;
			color: #3E3E3E;
			letter-spacing: 2.29rpx;
			display: flex;
		}

		.totalPrice {
			font-size: 32rpx;
			// color: #000000;
			letter-spacing: 2.29rpx;
			color: red;
			// margin-right: 10%;
		}

		.totalPrice1 {
			font-size: 40rpx;
			// color: #ff0000;
			// letter-spacing: 2.29rpx;
			color: red;
			// margin-bottom: 4px;
		}

		.totalNum {
			font-size: 32rpx;
			color: #0e348d;
			letter-spacing: 2.29rpx;
			color: red;
		}

		.submitOrder {
			width: 208rpx;
			height: 80rpx;
			background: #007f00;
			border-radius: 14rpx;
			border-radius: 14rpx;
			font-size: 36rpx;
			color: #FFFFFF;
			letter-spacing: 2.57rpx;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}


	.content {
		/* text-align: center; */
		height: 100%;
		display: flex;
		flex-direction: column;
	}

	.swiper-box {
		/* object-fit: full; */
		height: 220px;
	}

	.swiper-box2 {
		/* object-fit: full; */
		/* height: 190px; */
		/* max-width:100%; */
		height: 150px;
	}

	.swiper-box3 {
		/* object-fit: full; */
		height: 146px;
		/* max-width: 100%;		 */
	}

	.swiper-item {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		justify-content: center;
		align-items: center;
		background-color: #fff;
		color: #fff;
	}

	.image {
		width: 750rpx;
		height: 220px;
		/* object-fit: cover; */
	}

	.image2 {
		width: 750rpx;
		height: 150px;
		/* object-fit: cover; */
		/* object-fit: contain; */
	}

	.image3 {
		/* width: 750rpx;
		height: 1400upx; */
		/* position: fixed;
		object-fit: contain; */
		width: 750rpx;
		height: 145px;
	}

	.action {
		/* position: fixed;
			top:100px;
			z-index: 9999; */
	}

	.warp {
		color: #000000;
	}
	
	.centre {
		text-align: center;
		margin: 200rpx auto;
		font-size: 32rpx;
		image {
			width: 164rpx;
			height: 164rpx;
			border-radius: 50%;
			margin-bottom: 20rpx;
		}
		.tips {
			font-size: 24rpx;
			color: #999999;
			margin-top: 20rpx;
		}
		.btn {
			margin: 80rpx auto;
			width: 200rpx;
			border-radius: 32rpx;
			line-height: 64rpx;
			color: #ffffff;
			font-size: 26rpx;
			background: linear-gradient(270deg, rgba(249, 116, 90, 1) 0%, rgba(255, 158, 1, 1) 100%);
		}
	}
</style>